<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>新增成交员</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="bg-gray-100">
    <div class="min-h-screen">
        <header class="bg-white shadow">
            <div class="max-w-7xl mx-auto py-6 px-4">
                <div class="flex items-center">
                    <a href="./verifier_list.html" class="text-gray-500 hover:text-gray-700 mr-4">
                        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
                        </svg>
                    </a>
                    <h1 class="text-2xl font-bold text-gray-900">新增成交员</h1>
                </div>
            </div>
        </header>

        <main class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
            <div class="bg-white shadow rounded-lg overflow-hidden">
                <div class="px-4 py-5 sm:p-6">
                    <form class="space-y-8">
                        <!-- 基本信息 -->
                        <div>
                            <h3 class="text-lg leading-6 font-medium text-gray-900 mb-6">基本信息</h3>
                            <div class="grid grid-cols-2 gap-6">
                                <div>
                                    <label for="name" class="block text-sm font-medium text-gray-700">姓名</label>
                                    <input type="text" name="name" id="name" class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 sm:text-sm" placeholder="请输入姓名">
                                </div>
                                <div>
                                    <label for="phone" class="block text-sm font-medium text-gray-700">手机号</label>
                                    <input type="tel" name="phone" id="phone" class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 sm:text-sm" placeholder="请输入手机号">
                                </div>
                                <div>
                                    <label for="scenic" class="block text-sm font-medium text-gray-700">所属景区</label>
                                    <select id="scenic" name="scenic" class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 sm:text-sm">
                                        <option value="">请选择景区</option>
                                        <option value="1">三亚海棠湾景区</option>
                                        <option value="2">蜈支洲岛景区</option>
                                    </select>
                                </div>
                                <div>
                                    <label for="password" class="block text-sm font-medium text-gray-700">登录密码</label>
                                    <input type="password" name="password" id="password" class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 sm:text-sm" placeholder="请输入登录密码">
                                </div>
                            </div>
                        </div>

                        <!-- 核销权限 -->
                        <div>
                            <h3 class="text-lg leading-6 font-medium text-gray-900 mb-6">核销权限</h3>
                            <div class="space-y-4">
                                <div class="relative flex items-start">
                                    <div class="flex items-center h-5">
                                        <input id="ticket" name="ticket" type="checkbox" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded">
                                    </div>
                                    <div class="ml-3 text-sm">
                                        <label for="ticket" class="font-medium text-gray-700">门票核销</label>
                                        <p class="text-gray-500">允许核销景区门票</p>
                                    </div>
                                </div>
                                <div class="relative flex items-start">
                                    <div class="flex items-center h-5">
                                        <input id="food" name="food" type="checkbox" class="focus:ring-blue-500 h-4 w-4 text-blue-600 border-gray-300 rounded">
                                    </div>
                                    <div class="ml-3 text-sm">
                                        <label for="food" class="font-medium text-gray-700">餐饮券核销</label>
                                        <p class="text-gray-500">允许核销景区餐饮券</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- 备注信息 -->
                        <div>
                            <h3 class="text-lg leading-6 font-medium text-gray-900 mb-6">备注信息</h3>
                            <div>
                                <label for="remarks" class="block text-sm font-medium text-gray-700">备注</label>
                                <textarea id="remarks" name="remarks" rows="3" class="mt-1 block w-full border-gray-300 rounded-md shadow-sm focus:ring-blue-500 focus:border-blue-500 sm:text-sm" placeholder="请输入备注信息"></textarea>
                            </div>
                        </div>

                        <!-- 提交按钮 -->
                        <div class="pt-5">
                            <div class="flex justify-end">
                                <button type="button" class="bg-white py-2 px-4 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">取消</button>
                                <button type="submit" class="ml-3 inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">保存</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </main>
    </div>
</body>
</html>